<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>双向绑定</title>
</head>
<body>
<div id="app">
   <input v-model="name"/><br/>
   <input v-model="name"/><br/>
   <input v-model="name"/><br/>
    <hr/>
    java:<input type="checkbox" v-model="tec" value="java"/>
    c++:<input type="checkbox" v-model="tec" value="c++"/>
    php:<input type="checkbox" v-model="tec" value="php"/>
    vue:<input type="checkbox" v-model="tec" value="vue"/>
    <hr/>
    已选择课程有：{{tec.join()}}
</div>

<script src="../node_modules/vue/dist/vue.js"></script>
<script>
    let app = new Vue({
        el: "#app",
        data:{
            name:"ldh",
            tec:[] //只有声明成数组才表达要值，不是数组比如是双引号，要的是就是选中状态的true和false
        }

    });
</script>

</body>
</html>